<%@ page language="java" contentType="text/html; charset=UTF-8"
		 pageEncoding="UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<% String path = request.getContextPath();
	request.setAttribute("path",path);%>
<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>我的订单</title>
		<link rel="stylesheet" type="text/css" href="../../../css/wodedingdan.css"/>
		<link rel="shortcut icon" href="favicon.ico">
		<link href="${path}/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
		<link href="${path}/css/font-awesome.css?v=4.4.0" rel="stylesheet">
		<!-- Data Tables -->
		<link href="${path}/css/plugins/dataTables/dataTables.bootstrap.css"
			  rel="stylesheet">
		<link href="${path}/css/animate.css" rel="stylesheet">
		<link href="${path}/css/style.css?v=4.1.0" rel="stylesheet">
		<link rel="stylesheet" type="text/css" href="${path}/dist/sweetalert.css">
		<script src="../../../js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../../js/wodedingdan.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>

	<div id="live2d-widget" >
		<canvas id="live2dcanvas">
	</div>

	<script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
	<script src="https://eqcn.ajz.miesnfu.com/wp-content/plugins/wp-3d-pony/live2dw/lib/L2Dwidget.min.js"></script>
	<script>
        L2Dwidget.init({
            "model": {
                jsonPath: "https://unpkg.com/live2d-widget-model-hijiki/assets/hijiki.model.json",//这里改模型，前面后面都要改
                "scale": 1
            },
            "display": {
                "position": "left",//设置看板娘的上下左右位置
                "width": 200,
                "height": 500,
                "hOffset": 70,
                "vOffset": 70
            },
            "mobile": {
                "show": true,
                "scale": 0.5
            },
            "react": {
                "opacityDefault": 0.7,//设置透明度
                "opacityOnHover": 0.2
            }
        });
        window.onload = function () {
            $("#live2dcanvas").attr("style", "position: fixed; opacity: 0.7; right: 70px; bottom: 0px; z-index: 1; pointer-events: none;")
        }
	</script>


		<div id="div">
			<!--头-->
			<div id="head">
				<div id="title">
					<%--<span id="logo"><a href="index.jsp#shouyebufen">王府井永光酒店</a></span>--%>
					<span class="dh"><a href="/utils/forward/index/5">首页</a></span>
					<%--<span class="dh"><a href="index.jsp#fangjianyuding">房间预定</a></span>--%>
					<%--<span class="dh"><a href="index.jsp#jiudianxiangqing">酒店详情</a></span>--%>
					<%--<span class="dh"><a href="index.jsp#pingjia">评价</a></span>--%>
					<%--<span class="dh"><a href="">我的订单</a></span>--%>
				</div>
			</div>
			<div id="headTS"></div>

			<div id="content">
				<!--左边列表-->
				<div id="left">
					<ul>
						<li class="wdxxx">我的信息</li>
						<li class="ddxxx">订单信息</li>
						<li class="zhaqx">账户安全</li>
					</ul>
				</div>

				<!--右边内容-->
				<div id="right">
					<!--我的信息-->
					<div id="wdxx">
						<div class="right_title">
							我的信息
						</div>
						<div id="wdxx_tp">
							<div>我的头像</div>
							<img src="${userInfo.via}" />
						</div>
						<table border="0" cellpadding="20px">
							<tr>
								<td>用户名：</td>
								<td>${userInfo.username}</td>
							</tr>

							<tr>
								<td>真实姓名：</td>
								<td>${userInfo.name}</td>
							</tr>
							<tr>
								<td>性别：</td>
								<td>
								<c:if test="${userInfo.sex =='woman'}">女</c:if>
								<c:if test="${userInfo.sex =='man'}">男</c:if>
								</td>
							</tr>
							<tr>
								<td>email：</td>
								<td>${userInfo.email}</td>
							</tr>
							<tr>
								<td>电话号码：</td>
								<td>${userInfo.phone}</td>
							</tr>
						</table>
					</div>

					<!--订单信息-->
					<div id="ddxx">
						<div class="right_title">
							订单信息
						</div>
						<div class="ddxx_show ddxx_qbddx">
							<div class="ddxx_xxxx">
								<c:forEach items="${page.list}" var="order" >
									<table cellpadding="10px">
										<tr>
											<td rowspan="3" class="ddxx_mingcheng">王府井永光酒店</td>
											<td>预计入住时间：${order.orderRzTime}</td>
											<td class="ddxx_money">${order.orderPayMoney}</td>
											<td rowspan="3" width="200px"><c:if test="${order.orderStatus==0}">
												<a href="${path}/order/changeStatus1?id=${order.id}&status=1" class="btn btn-danger">取消订单</a>
											</c:if>
												<c:if test="${order.orderStatus==3}">
													<a href="" class="btn btn-primary">评价</a>
												</c:if>
											</td>
										</tr>
										<tr>
											<td>观潮景区临江路3号</td>
											<td class="ddxx_jinxinzhong">
												<c:if test="${order.orderStatus==0}">预定</c:if>
												<c:if test="${order.orderStatus==1}">取消</c:if>
												<c:if test="${order.orderStatus==2}">已入住</c:if>
												<c:if test="${order.orderStatus==3}">已完成</c:if>
												<c:if test="${order.orderStatus==4}">满客退单</c:if></td>
										</tr>
									</table>
								</c:forEach>
							</div>


							<div>
							<span style="float: left; padding: 5px">
								当前&nbsp;<span style="color: red;">${page.pageNum}</span>&nbsp;/&nbsp;<b>${page.pages}</b>&nbsp;页&nbsp;&nbsp;
								总共&nbsp;<b>${page.total}</b>&nbsp;条</span>
								<nav aria-label="Page navigation" style="margin: 0 auto; width: 240px">
									<ul class="pagination" style="margin: 0;">
										<li>
											<a href="${path}/order/orderPage?pageNo=${page.isFirstPage?1:page.prePage}"
											   aria-label="Previous"> <span aria-hidden="true">前一页</span>
											</a>
										</li>
										<c:forEach  begin="1" end="${page.pages}" varStatus="i">
											<li><a href="${path}/order/orderPage?pageNo=${i.count}">${i.count}</a></li>
										</c:forEach>
										<li><a href="${path}/order/orderPage?pageNo=${page.isLastPage?page.pages:page.nextPage}"
											   aria-label="Next"> <span aria-hidden="true">后一页</span>
										</a></li>
									</ul>
								</nav>
							</div>

						</div>
					</div>

					<!--我的消息-->
					<div id="wdxiaoxi">
						<div class="right_title">
							我的消息
						</div>
					</div>

					<!--账户安全-->
					<div id="zhaq">
						<div class="right_title">
							账户安全
						</div>
						<div class="zhaq_content">
							<div class="zhaq_content_img">
								<img src="../../../img/gougou.png"/>
							</div>
							<div class="zhaq_content_grxx">个人信息</div>
							<span class="zhaq_content_ct">修改个人信息不包括修改密码、手机号、邮箱</span>
							<span class="zhaq_grxx_xiugai"><a href="/jd/jdPreUpdate">修改</a></span>
						</div>
					</div>
				</div>

			</div>

			<!--页脚-->
			<div id="" style="margin-top: 100px;">
				<img src="../../../img/yejiao2.png"/>
			</div>
		</div>
	</body>
<script>

</script>
</html>
